/**
 * 模块名称：rem转换
 * 创建时间：2017-12-29 11:26:41
 * 说明：px转rem的mixin，输入px值即可
 */
@import 'global.config';

@mixin gradient($dir, $begin, $end) {
  background: linear-gradient($dir, $begin, $end);
}

// 背景颜色
@mixin bgColors($name, $color) {
  &-#{""+$name} {
    background-color: $color !important;

    &.btn {
      @if $color !=white {
        color: $white;
        border-color: $color;
      } @else {
        border-color: $default;
      }

      @if $init-config==web {
        &:hover {
          background-color: lighten($color, 10%) !important;
          border-color: lighten($color, 10%) !important;
        }
      }

      &[disabled],
      &[disabled="true"],
      &[ disabled="disabled"],
      &.disabled {
        background-color: lighten($color, 30%) !important;

        @if $color !=white {
          color: $white;
        } @else {
          color: $default;
        }
      }

      &:focus {
        background-color: $color !important;

      }

      &:active {
        color: lighten($btn-color, 50%);
        background-color: darken($color, 5%) !important;
      }
    }
  }
}

// 字体颜色
@mixin textColors($name, $color) {
  &-#{""+$name} {
    color: $color !important;
  }
}

// 使用时直接 width:units(50)=50x2rpx，最终结果：100rpx
@function units($val) {
  @return $val * $unit;
}

//边框颜色
@mixin borderColor($dir) {

  border: {
    @if ($dir !=null) {
      #{$dir}: {
        width: 1px;
        style: $border-type;
        color: $border-color !important;
      }
    } @else {
      #{$dir}: {
        width: 1px;
        style: $border-type;
        color: $border-color !important;
      }
    }
  }

  &.btn {
    border: 0;

    &::after {
      border: units(1) solid $border-color;
    }

    background-color: transparent;
  }

  @each $i in $colorsName {
    &.border-#{""+$i} {
      @if $dir !=null {
        border-#{""+$dir}-color: map-get($colorsMap, $i) !important;
      } @else {
        border-color: map-get($colorsMap, $i) !important;

        &.btn {
          border: 0 !important;

          &::after {
            border: {
              width: units(1) !important;
              color: map-get($colorsMap, $i) !important;
            }
          }

          color: map-get($colorsMap, $i);
          background-color: transparent;
        }
      }
    }
  }
}

// padding和margin的间距
@function pm($val) {
  @return units($val*$padding-interval);
}
